<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <!-- 主表单区域 -->
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="typeName">
              <a-select v-model="model.typeName" placeholder="请选择类型" style="width: 100%">
                <a-select-option :value="'磺化'"> 磺化 </a-select-option>
                <a-select-option :value="'泡花碱'"> 泡花碱 </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="营销生产计划" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="planCode">
              <a-input v-model="model.planCode" disabled placeholder="系统自动生成"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="物料编码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="productCode">
              <a-row>
                <a-col :span="19">
                  <a-input v-model="model.productCode" placeholder="请选择物料"></a-input>
                </a-col>
                <a-col :gutter="4">
                  <a-button @click="addMaterial" type="primary" :loading="confirmLoading">选择</a-button>
                </a-col>
              </a-row>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="物料名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="productBatchNo">
              <a-input v-model="model.productBatchNo" disabled></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="规格型号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="materialSpec">
              <a-input v-model="model.materialSpec" disabled></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="单位" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="meUnit">
              <a-input v-model="model.meUnit" disabled></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="数量" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="mainQuantity">
              <a-input v-model="model.mainQuantity" placeholder=""></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="交货日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="deliveryTime">
              <j-date
                placeholder="请选择交货日期"
                v-model="model.deliveryTime"
                :show-time="true"
                date-format="YYYY-MM-DD"
                style="width: 100%"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="配方编码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="formulaCode">
              <j-dict-select-tag
                type="list"
                v-model="model.formulaCode"
                dictCode="ips_tsl_formula_list,formula_code,formula_code"
                placeholder="请选择配方编码"
                @change="changeFormulaCode"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="配方号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="formulaNumber">
              <a-input v-model="model.formulaNumber" disabled></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="配方名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="formulaName">
              <a-input v-model="model.formulaName" disabled></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
    <erp-category-goods-list-modal
      ref="selectGoodsList"
      :modalWidth="1200"
      :category="1"
      @goodsOk="goodsOk"
      checkval="checkbox"
    ></erp-category-goods-list-modal>
  </a-spin>
</template>

<script>
import { getAction, postAction } from '@/api/manage'
import { JVxeTableModelMixin } from '@/mixins/JVxeTableModelMixin.js'
import { JVXETypes } from '@/components/jeecg/JVxeTable'
import { getRefPromise, VALIDATE_FAILED } from '@/components/jeecg/JVxeTable/utils/vxeUtils.js'
import { validateDuplicateValue } from '@/utils/util'
import JFormContainer from '@/components/jeecg/JFormContainer'
import store from '@/store'
import { getDate } from '@/utils'
import ErpCategoryGoodsListModal from '@comp/base/modal/ErpCategoryGoodsListModal'

export default {
  name: 'TslProductionPlanForm',
  mixins: [JVxeTableModelMixin],
  components: {
    JFormContainer,
    ErpCategoryGoodsListModal,
  },
  data() {
    return {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      model: {
        typeName: '',
        planCode: '',
        productCode: '',
        productBatchNo: '',
        materialSpec: '',
        meUnit: '',
        mainQuantity: '',
        auUnit: '',
        customCode: '',
        deliveryTime: '',
        formulaCode: '',
        formulaNumber: '',
        formulaName: '',
      },
      // 新增时子表默认添加几行空数据
      addDefaultRowNum: 1,
      validatorRules: {
        typeName: [{ required: true, message: '请选择类型!' }],
        productCode: [{ required: true, message: '请选择物料编码!' }],
        mainQuantity: [{ required: true, message: '请输入数量!' }],
        deliveryTime: [{ required: true, message: '请选择交货日期!' }],
        formulaCode: [{ required: true, message: '请选择配方编码!' }],
      },
      url: {
        add: '/pro/tslProSchedule/addPlan',
        edit: '/pro/tslProSchedule/editPlan',
        productByIds: '/review/bussContractRequirementReview/reviewProduct/ids',
        queryFormula: '/ipstslformulalist/ipsTslFormulaList/queryFormulaDetail',
      },
    }
  },
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false,
    },
  },
  computed: {
    formDisabled() {
      return this.disabled
    },
  },
  created() {},
  methods: {
    addMaterial() {
      this.$nextTick(() => {
        this.$refs.selectGoodsList.add()
      })
    },
    goodsOk(datas) {
      if (datas && datas.length == 1) {
        postAction(this.url.productByIds, { ids: datas }).then((res) => {
          let erpGoodsList = res.result
          this.model.orderProductId = erpGoodsList[0].id
          this.model.customCode = erpGoodsList[0].customCode
          this.model.productCode = erpGoodsList[0].code
          this.model.productBatchNo = erpGoodsList[0].name ? erpGoodsList[0].name : erpGoodsList[0].batchName
          this.model.materialSpec = erpGoodsList[0].noneSpec
          this.model.meUnit = erpGoodsList[0].meUnit
          this.model.auUnit = erpGoodsList[0].auUnit
        })
      } else {
        this.$message.error('请选择一条物料')
      }
    },
    async changeFormulaCode(formulaCode) {
      this.model.formulaNumber = ''
      this.model.formulaName = ''
      const res = await getAction(this.url.queryFormula, { formulaCode })
      if (res.success && res.result) {
        const main = res.result.main
        this.model = Object.assign({}, this.model, {
          formulaNumber: main.formulaNumber,
          formulaName: main.formulaDefine,
        })
      }
    },
    add() {
      postAction('/sys/fillRule/executeRuleByCode/production_plan_code', {}).then((res) => {
        this.model.planCode = res.result
        this.$forceUpdate()
      })
    },
    edit(record) {
      this.model = record
      console.log('111', record)
    },
    async handleOk() {
      //  校验主表单
      const mainFormValid = await new Promise((resolve) => {
        this.$refs.form.validate((valid) => resolve(valid))
      })
      if (!mainFormValid) return
      //  调用接口提交（根据实际接口调整）
      this.model.planQuantity = this.model.mainQuantity
      this.confirmLoading = true
      try {
        const url = this.model.id ? this.url.edit : this.url.add // 编辑/新增判断
        await postAction(url, this.model)
        this.$message.success('提交成功')
        this.$emit('ok') // 触发提交成功事件，通知模态框
      } catch (error) {
        this.$message.error('提交失败：' + (error.message || '网络异常'))
      } finally {
        this.confirmLoading = false
      }
    },
  },
}
</script>

<style scoped></style>
